<template>
  <div>
    <van-cell :title="apianuser.info_list[0].name" icon="apps-o" is-link @click="showPopup" />
    <van-popup v-model="show" position="right" :style="{ height: '100%',width:'100%' }">
      <van-nav-bar title="主题更改" left-text="返回" @click-left="onClickLeft" left-arrow :style="rgba[0]" />
      <div class="user_app">
        <div v-for="(item,i) of apianuser.theme_list" :key="i" class="back_div" @click="backcolor(item.bezel_color,item.unselect,item.select)">
          <p class="p_font">{{item.name}}</p>
          <p :style="item.bezel_color" class="p_color"></p>
        </div>
      </div>
    </van-popup>
  </div>
</template>

<script>
export default {
  name: "popupone",
  props: {
    // num:Number
  },
  data() {
    return {
      show: false,
      back_color:"#1989fa",
      apianuser:{},
      choice:[],
      rgba:[]
    };
  },
  created() {
    this.apianuser = JSON.parse(localStorage.getItem("swidata") || [])
    this.rgba = JSON.parse(localStorage.getItem("bakcColor"))
  },
  computed: {
    
  },
  mounted(){
    
  },
  methods: {
    showPopup() {
      this.show = true;
    },
    onClickLeft() {
      this.show = false;
    },
    backcolor(back,unse,se){
      // let color = back.substr(18,7)
      this.back_color = back
      this.choice = []
      this.choice.push(back)
      this.choice.push(unse)
      this.choice.push(se)
      localStorage.setItem("bakcColor",JSON.stringify(this.choice))
      this.show = false;
      this.$router.push({path:"/"})
    }
  }
};
</script>

<style lang="scss" scoped>
@import "@/style/user/popupone.scss";
</style>